<!DOCTYPE html>
<!--h5的标准：声明文档类型 html-->
<!--根标签:老大 leng='en' 翻译成英文-->
<html lang="en">
<head>
    <!--网页的头部-->
    <!--规定字符编码：国际编码 UTF-8-->
    <meta charset="UTF-8">
    <!--seo 给搜索引擎用-->
    <meta name="keywords" content="关键词">
    <!--seo 给搜索引擎用-->
    <meta name="description" content="网站的概要信息">
    <!--网页的标题-->
    <title>案例三：图片展示效果</title>
    <style type="text/css">
        body{margin: 0;font: 14px/1.5 "Microsoft YaHei"; background: #eee}
        .wrap{margin:50px auto; background: #fff;width: 280px;padding: 20px;}
        .wrap img{width: 280px; height: 280px;}
        .wrap p {margin: 0; padding: 0;line-height: 30px;}
        .wrap a{color: #000; text-decoration: none}
    </style>
</head>
<body>
<div class="wrap">
    <img src="../3：样式初始化及display+外边距合并/images/1.png" alt="化妆品">
    <p><a href="#" title="【shaiya莹】水之密语靓彩">【shaiya莹】水之密语靓彩</a></p>
    <p><a href="#" title="【抢新品NO.120】千金净雅妇科专用">【抢新品NO.120】千金净雅妇科专用</a></p>
    <p><a href="#" title="【抢新品NO.120】千金净雅妇科专用">【抢新品NO.120】千金净雅妇科专用</a></p>
</div>
</body>
</html>